import React from 'react';
import { inject, observer } from 'mobx-react';
import { Modal, message, Button, Spin } from "antd";

import { WeaLocaleProvider, WeaTop, WeaRightMenu, WeaTab, WeaReqTop, WeaDialog, WeaAlertPage } from 'ecCom';
import { WeaTableNew } from "comsMobx";
import { Condition, getAdButtons } from '../list/listCondition';
import { SpecialDialog } from '../../components/dialog/SpecialDialog';
import { RewardDialog } from '../../components/dialog/RewardDialog';
import { Text } from '../util/text';
import { InfoTag } from '../util/infoTag';
import { QuickSiftDialog } from '../dialog/QuickSiftDialog';
import { ShareDialog } from '../dialog/ShareDialog';
const text = new Text();
const WeaTable = WeaTableNew.WeaTable;
const getLabel = WeaLocaleProvider.getLabel;

@inject("handleListStore")
@observer
class HandleList extends React.Component {

	constructor(props) {
		super(props);
		this.state = {
		}
	}

	componentDidMount() {
		const { handleListStore } = this.props;
		const { params } = this.props;       //根据url中的type类型判断list类型，waitHandle(待处理),usedInfo(已采用),waitEdit(待编),publishedInfoSifting(已发布待编),waitPublish(待发布期刊)，published(已发布期刊)
		handleListStore.tabs = [];
		handleListStore.loadingSpin = true;
		handleListStore.getInfoHandleList(params);
	}

	componentWillReceiveProps(nextProps) {
		const { handleListStore } = this.props;
		const { params } = nextProps;
		if (this.props.location.key !== nextProps.location.key) {
			handleListStore.selectTabKey = "";
			handleListStore.tabs = [];
			handleListStore.loadingSpin = true;
			handleListStore.getInfoHandleList(params);
		}
	}

	getTopButtons = () => {
		const { handleListStore } = this.props;
		let btns = [];
		btns.push(
			handleListStore.getTopButton()
		)
		return btns;
	}
	changeTab(key) {
		const { handleListStore } = this.props;
		handleListStore.changeTab(key);
	}
	getRowSelection = () => {
		const { handleListStore } = this.props;
		const rowSelection = {
			onChange: (sRowKeys, selectedRows) => {
				handleListStore.selectedData = selectedRows;
			},
		}
		return rowSelection;
	}

	onOperatesClick = (record, index, operate, flag) => {
		const { handleListStore } = this.props;
		if (operate.index == 0) {
			handleListStore.getRewardListByInfoSiftId({ id: record.id });
			handleListStore.setState({ scoreVisible: true });
			//加分项弹出框隐藏，解决两个弹出框的层级问题
			handleListStore.rewardDialogStore.setState({ visible: false });
		}
	}

	showHistory = () => {
		const { handleListStore } = this.props;
		handleListStore.setState({ scoreVisible: true });
	}

	addScore = () => {
		const { handleListStore } = this.props;
		handleListStore.rewardDialogStore.getRewardList({ 'pathId': handleListStore.selectTabKey, 'type': '2' });
		handleListStore.rewardDialogStore.setState({ visible: true });
		handleListStore.setState({ scoreVisible: false });
	}
	delScore = () => {
		const { handleListStore } = this.props;
		handleListStore.delScore();
	}
	reRenderColumns(columns) {
		columns.forEach(c => {
			if (c.dataIndex == 'status') {      //期刊状态   (0未成文,1已成文,2未发布,3审批中,4驳回,5已发布)
				c.render = (text, record, index) => {
					let valueSpan = record[c.dataIndex + "span"];
					if (record[c.dataIndex] == '0') {
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@2y0139`} color='#d59d26' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '1') {
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@r3ozwk`} color='#1ad05d' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '2') {
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@69zetn`} color='#2db7f5' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '3') {
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@bdse13`} color='#ff9000' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '4') {
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@4cvnx6`} color='#dd3131' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '5') {
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@z1d5n8`} color='#bf8f8f' name={valueSpan}></InfoTag>
					}
				}
			} else if (c.dataIndex == 'siftStatus') {       //上报信息采编状态
				c.render = (text, record, index) => {
					let valueSpan = record[c.dataIndex + "span"];
					if (record[c.dataIndex] == '0') {        //已筛选
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@0o3nm5`} color='#1ad05d' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '1') {      //未签收
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@e637qt`} color='#ff6128' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '2') {      //已签收
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@z7ht9j`} color='#87d068' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '3') {      //驳回
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@6ql53b`} color='#dd3131' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '4') {      //已采用
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@n1e211`} color='#bf8f8f' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '5') {      //特殊采用
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@43gquy`} color='#4f8bfb' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '6') {      //专报采用
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@tc3rh2`} color='#b379f2' name={valueSpan}></InfoTag>
					} else if (record[c.dataIndex] == '7') {      //已发布
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@fwk6vs`} color='#bf8f8f' name={valueSpan}></InfoTag>
					} else {            //未筛选
						return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@4moaja`} color='#f50' name={valueSpan}></InfoTag>
					}
				}
			} else {
				c.render = function (text, record) {
					let valueSpan = record[c.dataIndex + "span"] !== undefined ? record[c.dataIndex + "span"] : record[c.dataIndex];
					return <span dangerouslySetInnerHTML={{ __html: valueSpan }}></span>
				}
			}
		})
		return columns;
	}
	render() {
		const { handleListStore } = this.props;
		const { loadingSpin, isRight, specialDialogStore, rewardDialogStore, rewardListStore, tableStore, scoreTableStore, title, status, tabs, selectTabKey, setState, saveJtypeAndJcolumn, form, condition, siftTableStore, reLoad, specialVisibleForm, specialCondition } = handleListStore;
		const { loading, visible, specialVisible, scoreVisible, jTypeVisible, quickVisible } = status;
		const { jTypeForm, jTpeCondition, enterComposing, saveQuickSift } = handleListStore;
		const rightMenu = handleListStore.getRightMenu();
		const { searchForm, searchCondition, showSearchAd, quickSiftForm, quickSiftCondition, periodsTableStore } = handleListStore;
		const formParams = searchForm.getFormParams() || {};
		if (loadingSpin) {
			return <div className="h100" style={{ textAlign: 'center', paddingTop: '300px' }}><Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@733olc`} size="large" /></div>
		}
		if (!isRight) {
			return <WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@9y0oev`}><div>{getLabel(382663, '暂无权限')}</div></WeaAlertPage>
		}
		let btns = new Array();
		btns.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ljob48@addScore`} onClick={() => { this.addScore() }} type="primary" shape="circle" icon="plus" size="small" ></Button>);
		btns.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@yp3vbx@delScore}`} onClick={() => { this.delScore() }} shape="circle" icon="minus" size="small"></Button>);
		// <WeaTop
		//     title={title}
		//     icon={<i className='icon-portal-workflow' />}
		//     iconBgcolor='#55D2D4'
		//     loading={loading}
		//     buttons={this.getTopButtons() }
		//     showDropIcon={true}
		//     dropMenuDatas={rightMenu}
		//     >
		//     <WeaTable comsWeaTableStore={tableStore}/>
		// </WeaTop>
		return (
			<div className='wea-govern-info'>
				<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@ad161z`}
					datas={rightMenu}>

					<div style={{ backgroundColor: '#fff' }}>
						<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@6fnbxh`}
							title={title}
							icon={<i className='icon-coms-government' />}
							iconBgcolor='#f14a2d'
							loading={loading}
							buttons={this.getTopButtons()}
							showDropIcon={true}
							dropMenuDatas={rightMenu}
						>
							<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@n8lwub`}
								leftStyle={{ width: '80%' }}
								datas={tabs}
								keyParam="key"  //主键
								selectedKey={selectTabKey}
								onChange={this.changeTab.bind(this)}
								buttonsAd={getAdButtons(handleListStore)}
								searchType={['base', 'advanced']}
								searchsBaseValue={formParams.title}
								setShowSearchAd={bool => { handleListStore.setShowSearchAd(bool) }}
								hideSearchAd={() => handleListStore.setShowSearchAd(false)}
								searchsAd={
									<div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@jgatwr`} listStore={handleListStore} form={searchForm} condition={searchCondition}  onEnterSearch={()=>{handleListStore.doSearch();handleListStore.setShowSearchAd(false);}} ></Condition></div>
								}
								showSearchAd={showSearchAd}
								onSearch={v => { handleListStore.doSearch() }}
								onSearchChange={v => {
									if (handleListStore.searchForm.has("title")) {
										handleListStore.appendFormFields({ title: { value: v } })
									} else {
										handleListStore.searchForm.add(v, { key: "title" })
									}
								}} />
							<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@ub47pg`} className="wea-info-table" getColumns={c => this.reRenderColumns(c)} needScroll={true} comsWeaTableStore={tableStore} register_table={() => reLoad()} rowSelection={this.getRowSelection()} onOperatesClick={this.onOperatesClick.bind(this)} />
							<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@uyhsbm`}
								icon="icon-coms-government"
								iconBgcolor='#f14a2d'
								title={text.SIFT}
								visible={visible}
								style={{ width: 550, height: 450 }}
								hasScroll={true}
								onCancel={() => { setState({ visible: false }) }}
								buttons={[(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@qol6dk@saveJtypeAndJcolumn`} type="primary" onClick={() => saveJtypeAndJcolumn()}>{text.SURE}</Button>),
								(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@5v44yc@CANCEL`} type="ghost" onClick={() => { setState({ visible: false }) }}>{text.CANCEL}</Button>)
								]}
							>
								<Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@it3rpy`} form={form} condition={condition} ></Condition>
								<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@eiiekx`} className="wea-info-table" needScroll={true} comsWeaTableStore={siftTableStore} />
							</WeaDialog>

							<SpecialDialog ecId={`${this && this.props && this.props.ecId || ''}_SpecialDialog@w3i7g2`} store={specialDialogStore} />
							<RewardDialog ecId={`${this && this.props && this.props.ecId || ''}_RewardDialog@7njkxu`} store={rewardDialogStore} />

							<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@r5r2uf`}
								icon="icon-coms-government"
								iconBgcolor='#f14a2d'
								title={text.HISTORYSCORE}
								visible={scoreVisible}
								style={{ width: 550, height: 450 }}
								hasScroll={true}
								onCancel={() => { setState({ scoreVisible: false }) }}
								buttons={[
									(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@1zrx0d@CLOSE`} type="ghost" onClick={() => { setState({ scoreVisible: false }) }}>{text.CLOSE}</Button>)
								]}
							>
								{selectTabKey != 'all' && <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@fo5ytz`} buttons={btns} />}
								<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@dlhmaq`} className="wea-info-table" comsWeaTableStore={scoreTableStore} needScroll={true}
								/>
							</WeaDialog>

							<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@c8am9a`}
								icon="icon-coms-government"
								iconBgcolor='#f14a2d'
								title={text.CHOOSEJTYPE}
								visible={jTypeVisible}
								style={{ width: 500, height: 150 }}
								hasScroll={true}
								onCancel={() => { setState({ jTypeVisible: false }) }}
								buttons={[(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@iyz08b@enterComposing`} type="primary" onClick={() => enterComposing()}>{text.COMPOSING}</Button>),
								(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@8124bt@jTypeVisible`} type="ghost" onClick={() => { setState({ jTypeVisible: false }) }}>{text.CLOSE}</Button>)
								]}
							>
								<Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@feh0ja`} form={jTypeForm} condition={jTpeCondition} ></Condition>
							</WeaDialog>

							{/* <WeaDialog
                                icon="icon-coms-government"
                                iconBgcolor='#f14a2d'
                                title={'快捷筛选'}
                                visible={quickVisible}
                                style={{ width: 500, height: 500 }}
                                onCancel={() => { setState({ quickVisible: false }) } }
                                buttons={[(<Button type="primary"  onClick={() => saveQuickSift() }>{text.SURE}</Button>),
                                    (<Button type="ghost" onClick ={() => { setState({ quickVisible: false }) } }>{text.CLOSE}</Button>)
                                ]}
                                >
                                <Condition  form={quickSiftForm} condition={quickSiftCondition} handleChange={this.handleChange.bind(this) }></Condition>
                                <WeaTable className="wea-info-table" comsWeaTableStore={periodsTableStore} needScroll={true} size="small" scroll={{ y: '300px' }}
                                    />
                            </WeaDialog> */}
							<QuickSiftDialog ecId={`${this && this.props && this.props.ecId || ''}_QuickSiftDialog@ki7qcc`} store={handleListStore} />
							<ShareDialog ecId={`${this && this.props && this.props.ecId || ''}_ShareDialog@cuwr9k`} store={handleListStore} pathId={selectTabKey} />
						</WeaTop>
					</div>

				</WeaRightMenu>
			</div>
		)
	}

}

export default HandleList;